<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>index</title>
	<link href="./common/css/bootstrap.min.css" rel="stylesheet">
	<link href="./common/css/font-awesome.min.css" rel="stylesheet"/>

	<script src="http://static.sxbang.net/jquery/jquery-2.1.4.min.js"></script>
	<script src="./common/js/bootstrap.min.js"></script>

</head>
<body>

	<style >
	body {
	}
	#cyberplayer-container {
		height: 600px;
	}
	</style>
	<script type="text/javascript">
	var yhsrc = "http://video.sxbang.net/78cd7d53733d42fe9e531ffb05764d5f/76cbd381b10b4f01a608a680c7324cd4-S00000001-200000.mp4";
	var bqsrc = "http://video.sxbang.net/78cd7d53733d42fe9e531ffb05764d5f/76cbd381b10b4f01a608a680c7324cd4-5287d2089db37e62345123a1be272f8b.mp4";
	yhsrc= "http://itpp-1253344989.file.myqcloud.com/project/120/22%20Jenkins%E7%AC%AC%E4%B8%80%E4%B8%AAJob%E6%A1%88%E4%BE%8B-v111545104216000.mp4";
	bqsrc= "http://itpp-1253344989.file.myqcloud.com/project/120/22%20Jenkins%E7%AC%AC%E4%B8%80%E4%B8%AAJob%E6%A1%88%E4%BE%8B-v111545104216000.mp4";
	var aptest = "http://itpp-1253344989.file.myqcloud.com/annual-report/SSM%E6%A1%86%E6%9E%B6%E9%87%87%E8%AE%BF%E5%89%AA%E8%BE%91.mp4";
	</script>
	<!-- <link rel="stylesheet" href="./common/css/bootstrap-datetimepicker.min.css"/>
	<script src="./common/js/bootstrap-datetimepicker.min.js"></script>
	<script src="./common/js/bootstrap-datetimepicker.zh-CN.min.js"></script> -->

	<link href="./common/css/emokr-toast.css?v=201807241807" rel="stylesheet"/>
	<link href="./demo/css/demo.css?v=201807241807" rel="stylesheet"/>

	<h2>ali视频点播上传</h2>
	<div class="aliupload">
		<input type="file" name="" value=""><br>
		<button type="button" name="button">upload</button>
	</div>

	<script type="text/javascript" charset="utf-8" src="./common/js/video/cyberplayer.js"></script>
	<h2>cyberplayer</h2>
	<div id="cyberplayer-container">
		<div id="bcePlayerContainerDiv"></div>
	</div>

	<script type="text/javascript">
	var fileAddress = bqsrc;
	var player = cyberplayer("bcePlayerContainerDiv").setup({
		width: "100%",
		height: "100%",
		autostart: false,
		stretching: "uniform",
		repeat: false,
		volume: 100,
		primary: "html5",
		playRate: true,
		keyControls:true,
		playRateConfig: [{label:"×1"}],
		controlbar: {barLogo: false},
		//file: fileAddress,//
		playlist: [
			{
				sources: [
					{
						file: aptest, // 资源2 必须与资源1格式和时长一致！
						label: "标清"
					}
					/*,{
						file: yhsrc, // 资源1 支持mp4, hls, flv等常用视频格式
						label: "高清" // 标签
					},*/

				]
			}
		],
		//播放条目的标题，首次出现播放按钮的时候在播放器左上角显示
		//播放条目对应的字幕配置,这里包络中英文字幕。开发者可以根据需要添加任意数量的字幕。

		ak: 'b40f25c60d6d42e89eceb8e9dd5c42ac',
	});
	player.on('play',function(){
		console.log('play');
	});
</script>

<link rel="stylesheet" href="https://g.alicdn.com/de/prismplayer/2.7.4/skins/default/aliplayer-min.css" />
<script type="text/javascript" charset="utf-8" src="https://g.alicdn.com/de/prismplayer/2.7.4/aliplayer-min.js"></script>
<h2>aliplayer</h2>
<div id="player-con"></div>
<script>
var player = new Aliplayer({
	id: "player-con",
	source: bqsrc,
	width: "100%",
	height: "500px",
	cover: 'https://img.alicdn.com/tps/TB1EXIhOFXXXXcIaXXXXXXXXXXX-760-340.jpg',
	/* 设置封面时需要将 autoplay 和 preload 设置为 false */
	autoplay: false,
	preload: false,
	language: "zh-cn",
	isLive: false
}, function (player) {
	console.log("播放器创建成功");
});
</script>

<!-- <div class="demo">
<img id="demoimg" onload="imgload(this)" onerror="imgerror(this)"
src="http://test-emoker.oss-cn-shenzhen.aliyuncs.com/demo/wnmp_for_demo1.jpg?x-oss-process=style/preload_for_pics&Expires=1544176741&OSSAccessKeyId=TMP.AQGdHJsy5qm_Iube59ktkmVD3cLAYShffkHnRa1-aHxpDyyPnT6PvVBV0QkmADAtAhUA3_n_rc_KWQpfvvmliDgFE2o9Mt8CFC_vtJuB84McTIh61knzQ15-uJCN&Signature=IDhQwSIfVXcB0t0GkqpbgF4rImU%3D" alt="">
</div> -->

<script src="./common/js/emokr-toast.js?v=201807241809"></script>
<script src="./demo/js/demo.js?v=201807241809"></script>
</body>
</html>
